import logo from '@/public/image/logoJian.png'
import { useState } from 'react';
import { Button } from 'antd';
import ad from '@/public/image/ad.webp'

const MainTopHeader = () => {
    
    const [open, setOpen] = useState(false);
    const headleSlipInto = () => {
        setOpen(true)
    }
    const headleSlipOut = () => {
        setOpen(false)
    }
    return (
        <>
            <a onMouseOver={headleSlipInto} onMouseOut={headleSlipOut} href='http://localhost:5173/' className='headerLogo'>
                <img src='https://lib.eqh5.com/eqx.layout/images/new_logo.svg' />
            </a>
            {
                open ?
                    <>
                        <img width={56} src={logo} alt="" className='homeLogoJian' />
                        <div className='headerCollect'>拖动&nbsp;LOGO&nbsp;到书签栏收藏&nbsp;,&nbsp;方便快速制作</div>
                    </> : ''
            }
            <ul className='homeNav'>
                <li><b>免费模板</b><img className='home_Nav_Badge' src="https://lib.eqh5.com/eqx.layout/images/tiphot.svg" alt="" /></li>
                <li>开通会员<img className='home_Nav_Badge' width={50} src="https://lib.eqh5.com/eqx.layout/images/vip_corner_2.png" alt="" /></li>
                <li>产品服务</li>
                <li>解决方案</li>
                <li>内容中心</li>
                <li>资源与合作</li>
            </ul>
            <div className='home_login_sign'>
                <Button type="primary">登录/注册</Button>
            </div>
            <img width={250} className='home_login_ad' src={ad} alt="" />
        </>
    )
}

export default MainTopHeader